<template>
    <li class="fl db-item"  v-if="path!='/'" style="text-align:center;background: ghostwhite;"><a href="/dashboard/" style="color:#bf616a;font-size: medium">返回控制台</a></li>

    <li class="fr db-item profile">
         <a v-on:click.stop.prevent="status.show='profile'" class="cb">
             <img v-bind:src="user.avatar" v-if="user.avatar" class="db-user-logo fl">
             <img v-else src="../../assets/img/defaultlogo.jpg" class="db-user-logo fl">
             <span class="fl">个人面板</span></a>
         <ul class="db-item-sub" v-show="status.show=='profile'" v-cloak>
             <li class="db-item db-profile-info">
                 <div class="cb">
                     <img v-bind:src="user.avatar" v-if="user.avatar" class="db-user-logo fl">
                     <img src="../../assets/img/defaultlogo.jpg" v-else="user.avatar" class="db-user-logo fl">
                     <div class="fl db-nav-sub-profile">
                         <p class="db-nav-profile-name">{{user.nickname}}</p>
                         <p class="db-nav-profile-email">{{user.email}}</p>
                     </div>
                 </div>
             </li>
             <li  class="db-item"><a v-link="'/profile'"><i class="iconfont icon-user"></i>个人中心</a></li>
             <li class="db-item"><a v-link="'/profile/security'"><i class="iconfont icon-setting"></i>安全设置</a></li>
             <!--<li class="db-item"><a v-link="'/profile/relation'"><i class="iconfont icon-relation"></i>关联账户</a></li>-->
             <li class="db-item"><a v-on:click.stop.prevent="logout"><i class="iconfont icon-logout"></i>退出登录</a></li>
         </ul>
    </li>
</template>
<script>
    document.addEventListener('route.click',function(e){
        data.path = e.detail.path;
    });
    document.addEventListener('project.message',function(e){
        data.messages.unshift(e.detail);
    });

    import utils from '../../src/utils.js';
    var data={
        path:'',
        status:{
            show:''
        },
        user:utils.user(),
        messages:[]
    };
    $(document).on('click',function(){
        data.status.show=''
    });
    export default {
        data:function(){
            return data;
        },
        watch:{
            "path":function(value){
                if(value && value.indexOf('/profile')==0){
                    $('body').addClass('profile');
                }else{
                    $('body').removeClass('profile');
                }
            }
        },
        methods: {
            go:function(path){
                this.$route.router.go({path:'/project'+this.projectId+path})
            },
            logout: function () {
                utils.logout();
            }
        }
    }
</script>